<template>
  <div>
    <div>Home</div>
    <!-- 渲染二级路由 -->
    <router-view />
  </div>
</template>

<script lang="ts">
export default {
  name: "Home",
};
</script>

<script lang="ts" setup>
import { onMounted, onBeforeUnmount, onActivated, onDeactivated } from "vue";

onMounted(() => {
  console.log("Home onMounted");
});

onBeforeUnmount(() => {
  console.log("Home onBeforeUnmount");
});

onActivated(() => {
  console.log("Home onActivated");
});

onDeactivated(() => {
  console.log("Home onDeactivated");
});
</script>

<style scoped></style>
